<template>
	<main-content>
		<view class="content-color">
			<view class="">
				<template v-for="(group,groupI) in viewConfig" :key="groupI">
					<view>
						<view class="p-16">
							<group-title>
						<template #icon>
							<view class="main-color">
								<u-icon name="title-icon" custom-prefix="custom-icon" />
							</view>
						</template>
						{{groupArr[groupI]}}</group-title>
						</view>
						<view class="view-group">
							<view class="view-item p-x-16 p-y-12 flex flex-row justify-between items-center"
								style="border-bottom: 1rpx solid rgba(231, 230, 228, 1);"
								v-for='(item,i) in group.filter(e=>!e.hide)' :key="i">
								<view class="list-title">
									{{item.label}}
									<u-icon name="question-circle-fill" @click="showTipFn(item.tip)"
										v-if='item.tip'></u-icon>
								</view>
								<view class="">
									{{
										item?.customRender ? item.customRender({formData,text:formData[item.dataIndex]}) : formData[item.dataIndex]
									}}
									<u-icon v-if="item.copy" name="copy-fill" custom-prefix="custom-icon"
										:color="maiColor" class="p-l-2" @tap.stop="copy(formData[item.dataIndex])" />
								</view>
							</view>
						</view>
					</view>
				</template>
			</view>
		</view>

		<u-popup v-model="showTip" mode="center" width="500rpx" border-radius="14" :closeable='true'>
			<view>
				<view class="p-14">
					<group-title>
						<template #icon>
							<view class="main-color">
								<u-icon name="title-icon" custom-prefix="custom-icon" />
							</view>
						</template>
						提示</group-title>

				</view>
				<view class="p-16">
					{{tipContent}}
				</view>
				<view class="p-16">
					<u-button type="primary" @click="showTip=false">确认</u-button>
				</view>
			</view>
		</u-popup>
	</main-content>
</template>
<script setup name='index'>
	import {
		reactive,
		ref,
		getCurrentInstance,
		computed,
		nextTick
	} from 'vue'
	import {
		onLoad,
		onShow,
		onReady
	} from '@dcloudio/uni-app'
	import {
		useCommonStore
	} from '@/stores/common.js'
	import {
		useUserStore
	} from '@/stores/user.js'
	import {
		ZZB_AGENT_NO_STATUS,
		TRADE_STATUS,
		AUTH_BUSS_TYPE,
		ZZB_NO_TYPE_MCH,
		ZZB_PAY_WAY,
		ZZB_CHANNEL_TYPE,
		ZZB_PAY_TYPE,
		ALLOC_STATUS
	} from '@/common/dict.js'
	import {
		selectDictLabel,
		parseTime,
		copy,
		formatToMoney
	} from '@/common/common.js'
	import {
		orderApi
	} from '@/pages-menus/common/api/order/index.js'

	const commonStore = useCommonStore()
	const {
		proxy
	} = getCurrentInstance()

	const maiColor = computed(() => {
		return proxy.$System.maiColor.value
	})
	const initForm = {
		id: undefined,
		no: undefined, //商户账号
		noType: undefined, //商户账号
		pwd: undefined, //商户密码
		confirmPwd: undefined, //商户密码
		companyName: undefined, //公司名称
		companyAbbrName: undefined, //公司简称
		name: undefined, //联系人
		phone: undefined, //联系方式
		areaCode: undefined, //城市，所属区/县ID
		addr: undefined, //地址
		authBussType: undefined, //授权业务，0全部，1开设代理商，2开商户
		status: undefined, //状态，0正常使用，1禁止开代理商，2禁止开商户，3禁止操作人员登录，4系统停止使用，5停止全部收款，6全部禁用
		exhibitionId: undefined, //开户业务人员
		// profitDrawType: undefined, //分润提现，0统一提现，1逐级提现
	}
	const formData = ref({
		...initForm
	})

	const groupArr = ['订单基本信息', '订单其他金额信息', '其他信息']
	const viewConfig = ref([
		[{
			label: '商户名称',
			dataIndex: 'merchantName'
		}, {
			label: '门店名称',
			dataIndex: 'storeName'
		}, {
			label: '订单标题',
			dataIndex: 'subject',
		}, {
			label: '商品描述',
			dataIndex: 'body',
		}, {
			label: '备注',
			dataIndex: 'remark',
			hide: useUserStore().userType == '2'
		}, {
			label: '订单金额',
			dataIndex: 'tradeAmt',
			customRender: (data) => {
				return `${formatToMoney(data.text / 100)}元`
			},
		}, {
			label: '创建时间',
			dataIndex: 'cTime',
			customRender: (data) => {
				return parseTime(data.text)
			},

		}, {
			label: '交易状态',
			dataIndex: 'status',
			customRender: (data) => {
				return selectDictLabel(TRADE_STATUS, data.text)
			},
		}, {
			label: '交易订单号',
			dataIndex: 'id',
			copy: true,
		}, {
			label: '支付方式',
			dataIndex: 'payWay',
			customRender: (data) => {
				return selectDictLabel(ZZB_PAY_WAY, data.text)
			},
		}, {
			label: '通道类型',
			dataIndex: 'channelType',
			customRender: (data) => {
				return selectDictLabel(ZZB_CHANNEL_TYPE, data.text)
			},
		}, {
			label: '交易类型',
			dataIndex: 'payType',
			customRender: (data) => {
				return selectDictLabel(ZZB_PAY_TYPE, data.text)
			},
		}],
		[{
			label: '交易手续费',
			dataIndex: 'fee',
			customRender: (data) => {
				return `${formatToMoney(data.text / 100)}元`
			},
		}, {
			label: '退款金额',
			dataIndex: 'refundAmt',
			customRender: (data) => {
				return `${formatToMoney(data.text / 100)}元`
			},
		}, {
			label: '实际分账金额',
			dataIndex: 'allocAmt',
			customRender: (data) => {
				return `${formatToMoney(data.text / 100)}元`
			},
			tip: '营收金额=订单金额－退款金额',
		}, {
			label: '结算金额',
			dataIndex: 'settleAmt',
			customRender: (data) => {
				return `${formatToMoney(data.text / 100)}元`
			},
			tip: '实际分账金额=分账金额－退分账金额',
		}, {
			label: '实收金额',
			dataIndex: 'paidUpAmt',
			customRender: (data) => {
				return `${formatToMoney(data.text / 100)}元`
			},
			tip: '实收金额=订单金额－退款金额-交易手续费-实际分账金额',
		}, {
			label: '营收金额',
			dataIndex: 'revenueAmt',
			customRender: (data) => {
				return `${formatToMoney(data.text / 100)}元`
			},
			tip: '营收金额=订单金额－退款金额',
		}],
		[{
			label: '分账状态',
			dataIndex: 'allocStatus',
			customRender: (data) => {
				return selectDictLabel(ALLOC_STATUS, data.text)
			},
		}, {
			label: '商家账号/商户号',
			dataIndex: 'channelMchid',
		}, {
			label: '支付订单号',
			dataIndex: 'oId',
			copy: true,
		}, {
			label: '渠道订单号',
			dataIndex: 'tId',
			copy: true,
		}, {
			label: '通道名称',
			dataIndex: 'channelName',
		}, {
			label: '公司名称',
			dataIndex: 'channelCompanyName',
		}, {
			label: '产品名称',
			dataIndex: 'productName',
		}, {
			label: '商家费率',
			dataIndex: 'rate',
			customRender: (data) => (data.payType == 0 ? data.onlineRate : data.offlineRate),
		}],
	])

	const queryData = ref({})
	const getForm = () => {
		orderApi.findId(queryData.value).then((res) => {
			if (res.code != 200) return
			formData.value = res.data
		})
	}

	// 显示提示
	const showTip = ref(false)
	const tipContent = ref('')
	const showTipFn = (val = '') => {
		showTip.value = true
		tipContent.value = val
	}

	const initFormView = () => {
		getForm()
	}

	onLoad(async (options) => {
		if (options.id) {
			queryData.value.id = options.id
			initFormView()
		}
	})
	onReady(() => {})
</script>
<style lang='scss' scoped>
	.view-group {
		background-color: #fff;
	}

	.operate-box {
		position: fixed;
		z-index: 99;
		bottom: 50rpx;
	}

	.tar {
		:deep(.u-input) {
			text-align: right !important;
		}
	}
</style>